import React from 'react';
import { storiesOf, action } from '@kadira/storybook';
import { withKnobs, number } from '@kadira/storybook-addon-knobs';
import { muiTheme } from 'storybook-addon-material-ui';
import PhaseStepper from './PhaseStepper';
/*global module*/

storiesOf('小番号表示', module)
  .addDecorator(muiTheme())
  .addDecorator(withKnobs)
    .add('2つ', () => (
      <PhaseStepper
        stepIndex={number('stepIndex', 0)}
        stepSize={2}
      />
    ))
    .add('3つ', () => (
      <PhaseStepper
        stepIndex={number('stepIndex', 0)}
        stepSize={3}
      />
    ))
    .add('いっぱい', () => (
      <PhaseStepper
        stepIndex={number('stepIndex', 0)}
        stepSize={number('stepSize', 4)}
      />
    ));
